<style itemscope>
    .layui-form-label.required:before {
        /* 这种写法也可以*/
        content: ' *';
        color: red;
    }

    .addProductionPlanForm-title .title,
    .examineProductionPlanForm-title .title {
        display: inline-block;
        margin: 20px;
        font-size: 16px;
        font-weight: bold;
        color: #333333;
        line-height: 19px;
        position: relative;
        padding: 6px 0 19px 0;
    }

    .addProductionPlanForm-title .title:after,
    .examineProductionPlanForm-title .title:after {
        content: '';
        display: block;
        position: absolute;
        left: 0;
        bottom: 0;
        width: calc(100% + 6px);
        height: 3px;
        background: #0A8B0A;
    }

    .open-form .layui-input-block {
        margin-left: 115px;
    }
</style>
<script type="text/html" id="qualityItemTableBar">
    <!--    <a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="edit">修改</a>-->
<!-- {{# if(d.status!=="1"){  }} -->
<a class="layui-btn layui-btn-primary layui-btn-xs" lay-event="detection">检测详情</a>
<!-- {{#} }} -->
</script>
<script type="text/javascript" src="../../../admin/assets/js/pdfobject.min.js"></script>
<!-- 表单弹窗 -->
<form lay-filter="orderQualityTaskForm" class="layui-form open-form">
    <div class="open-model">
        <div class="open-auto">
            <div class="layui-form-item layui-row">
                <div class="layui-col-md3">
                    <label class="layui-form-label w-auto required">质检任务：</label>
                    <div class="layui-input-block">
                        <input id="code" name="code" disabled type="text" class="layui-input" autocomplete="off" />
                    </div>
                </div>
                <div class="layui-col-md3">
                    <label class="layui-form-label w-auto required">质检类型：</label>
                    <div class="layui-input-block">
                        <select id="qualityTestingTypeId" readonly="readonly" name="qualityTestingTypeId"
                            lay-filter="qualityTestingTypeId" class="common-select-search">
                        </select>
                    </div>
                </div>
                <!--                <div class="layui-col-md3">-->
                <!--                    <label class="layui-form-label w-auto">所属开工单：</label>-->
                <!--                    <duv class="layui-input-block">-->
                <!--                        <input name="productionPlanId" id="productionPlanId" class="layui-input" type="text"-->
                <!--                               readonly="readonly"-->
                <!--                               style="cursor: pointer;"/>-->
                <!--                    </duv>-->
                <!--                </div>-->
                <div class="layui-col-md3">
                    <label class="layui-form-label w-auto">所属开工单：</label>
                    <div class="layui-input-block">
                        <input id="productionPlanId" disabled name="productionPlanId" placeholder="所属开工单" type="text"
                            class="layui-input" autocomplete="off" />
                    </div>
                </div>
                <div class="layui-col-md3">
                    <label class="layui-form-label w-auto">所属计划：</label>
                    <div class="layui-input-block">
                        <input id="planCode" disabled name="planCode" placeholder="所属计划" type="text" class="layui-input"
                            autocomplete="off" />
                    </div>
                </div>
            </div>
            <div class="layui-form-item layui-row">
                <div class="layui-col-md3">
                    <label class="layui-form-label w-auto required">送检工位：</label>
                    <div class="layui-input-block">
                        <select id="inspectDeviceCode" disabled lay-search="" name="inspectDeviceCode"
                            lay-filter="inspectDeviceCode" class="common-select-search">
                        </select>
                    </div>
                </div>
                <div class="layui-col-md3">
                    <label class="layui-form-label w-auto">载具编码：</label>
                    <div class="layui-input-block">
                        <input id="carrierCode" disabled name="carrierCode" placeholder="请输入载具编码" type="text"
                            class="layui-input" autocomplete="off" />
                    </div>
                </div>
                <div class="layui-col-md3">
                    <label class="layui-form-label w-auto required">样品数：</label>
                    <div class="layui-input-block">
                        <input id="submissionQuantity" disabled name="submissionQuantity" type="text"
                            class="layui-input" autocomplete="off" />
                    </div>
                </div>
                <div class="layui-col-md3">
                    <label class="layui-form-label w-auto required">已检测数：</label>
                    <div class="layui-input-block">
                        <input id="detectionQuantity" disabled name="detectionQuantity" type="text" class="layui-input"
                            autocomplete="off" />
                    </div>
                </div>
            </div>
            <div class="layui-form-item layui-row">
                <div class="layui-col-md3">
                    <label class="layui-form-label w-auto">送检备注：</label>
                    <div class="layui-input-block">
                        <input id="remark" name="remark" disabled placeholder="请输入备注" type="text" class="layui-input"
                            autocomplete="off" />
                    </div>
                </div>
                <div class="layui-col-md3">
                    <label class="layui-form-label w-auto">物料规格：</label>
                    <div class="layui-input-block">
                        <input id="skuSpec" disabled name="skuSpec" placeholder="物料规格" type="text"
                            class="layui-input" autocomplete="off" />
                    </div>
                </div>


                <!-- <div class="layui-col-md3">
                    <label class="layui-form-label w-auto required">质检性质：</label>
                    <div class="layui-input-block">
                        <select id="qualityTestingNatureId" disabled name="qualityTestingNatureId"
                                lay-filter="qualityTestingNatureId"
                                class="common-select-search">
                        </select>
                    </div>
                </div>-->

                <div class="layui-col-md3">
                    <label class="layui-form-label w-auto required">质检类型：</label>
                    <div class="layui-input-block">
                        <select id="qcQualityTypeId" name="qcQualityTypeId" lay-filter="qcQualityTypeId"
                            class="common-select-search" disabled></select>
                    </div>
                </div>


                <div class="layui-col-md3">
                    <label class="layui-form-label w-auto">物料编号：</label>
                    <div class="layui-input-block">
                        <input id="skuCode" disabled name="skuCode" placeholder="物料编号" type="text" class="layui-input"
                            autocomplete="off" />
                    </div>
                </div>
            </div>
            <div class="layui-form-item layui-row">
                <div class="layui-col-md3">
                    <label class="layui-form-label w-auto required">质检分类：</label>
                    <div class="layui-input-block">
                        <select id="qualityTestingCategoryId" disabled name="qualityTestingCategoryId"
                            lay-filter="qualityTestingCategoryId" class="common-select-search">
                        </select>
                    </div>
                </div>
                <div class="layui-col-md3">
                    <label class="layui-form-label w-auto">物料名称：</label>
                    <div class="layui-input-block">
                        <input id="skuName" disabled name="skuName" placeholder="物料名称" type="text" class="layui-input"
                            autocomplete="off" />
                    </div>
                </div>
                <div class="layui-col-md3">
                    <label class="layui-form-label w-auto required">判定结果：</label>
                    <div class="layui-input-block">
                        <input id="statusDesc" disabled style="border: none" name="statusDesc" type="text"
                            class="layui-input" autocomplete="off" />
                    </div>
                </div>
            </div>
            <div class="layui-form-item layui-row">
                <div class="layui-col-md4">
                    <label class="layui-form-label w-auto">附件：</label>
                    <div class="layui-input-block">
                        <div id="attachmentsDiv" class="attachments">
                            <img name="attachments" src="../../../admin/assets/images/attachmentsIcon/pdf.png">
                        </div>
                    </div>
                </div>
            </div>
            <div class="layui-form-item layui-row">
                <div class="layui-tab" lay-filter="test-handle" lay-allowclose="true">
                    <ul class="layui-tab-title">
                        <li class="layui-this">任务时间线</li>
                        <li lay-id="BOMGUIHUA">样品检测结果</li>
                    </ul>
                    <div class="layui-tab-content" style="padding-top: 5px">
                        <div class="layui-tab-item layui-show" style="padding-top: 10px;">
                            <div class="layui-timeline">
                                <div class="layui-timeline-item">
                                    <i class="layui-icon layui-timeline-axis"></i>
                                    <div class="layui-timeline-content layui-text">
                                        <h3 class="layui-timeline-title">创建任务<span id="createTaskTime">2013</span></h3>
                                        <p>
                                            <label class="layui-form-label w-auto">作业人：</label>
                                        <div class="layui-input-block">
                                            <input id="createName" style="border: none" readonly="readonly"
                                                name="createName" type="text" class="layui-input" autocomplete="off" />
                                        </div>
                                        </p>
                                        <p>
                                            <label class="layui-form-label w-auto">所属岗位：</label>
                                        <div class="layui-input-block">
                                            <input id="createPostName" style="border: none" readonly="readonly"
                                                name="createPostName" type="text" class="layui-input"
                                                autocomplete="off" />
                                        </div>
                                        </p>
                                        <p>
                                            <label class="layui-form-label w-auto">所属部门：</label>
                                        <div class="layui-input-block">
                                            <input id="createDepName" style="border: none" readonly="readonly"
                                                name="createDepName" type="text" class="layui-input"
                                                autocomplete="off" />
                                        </div>
                                        </p>
                                    </div>
                                </div>
                                <div class="layui-timeline-item">
                                    <i class="layui-icon layui-timeline-axis"></i>
                                    <div class="layui-timeline-content layui-text">
                                        <h3 class="layui-timeline-title">认领任务<span id="getTaskTime">2013</span></h3>
                                        <p>
                                            <label class="layui-form-label w-auto">认领人：</label>
                                        <div class="layui-input-block">
                                            <input id="getName" style="border: none" readonly="readonly" name="getName"
                                                type="text" class="layui-input" autocomplete="off" />
                                        </div>
                                        </p>
                                        <p>
                                            <label class="layui-form-label w-auto">所属岗位：</label>
                                        <div class="layui-input-block">
                                            <input id="getPostName" style="border: none" readonly="readonly"
                                                name="getPostName" type="text" class="layui-input" autocomplete="off" />
                                        </div>
                                        </p>
                                        <p>
                                            <label class="layui-form-label w-auto">所属部门：</label>
                                        <div class="layui-input-block">
                                            <input id="getDepName" style="border: none" readonly="readonly"
                                                name="getDepName" type="text" class="layui-input" autocomplete="off" />
                                        </div>
                                        </p>
                                    </div>
                                </div>
                                <div class="layui-timeline-item">
                                    <i class="layui-icon layui-timeline-axis"></i>
                                    <div class="layui-timeline-content layui-text">
                                        <h3 class="layui-timeline-title">检出结果<span id="checkTaskTime">2013</span></h3>
                                        <p>
                                            <label class="layui-form-label w-auto">检出人：</label>
                                        <div class="layui-input-block">
                                            <input id="checkName" style="border: none" readonly="readonly"
                                                name="checkName" type="text" class="layui-input" autocomplete="off" />
                                        </div>
                                        </p>
                                        <p>
                                            <label class="layui-form-label w-auto">所属岗位：</label>
                                        <div class="layui-input-block">
                                            <input id="checkPostName" style="border: none" readonly="readonly"
                                                name="checkPostName" type="text" class="layui-input"
                                                autocomplete="off" />
                                        </div>
                                        </p>
                                        <p>
                                            <label class="layui-form-label w-auto">所属部门：</label>
                                        <div class="layui-input-block">
                                            <input id="checkDepName" style="border: none" readonly="readonly"
                                                name="checkDepName" type="text" class="layui-input"
                                                autocomplete="off" />
                                        </div>
                                        </p>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="layui-tab-item" id="bom_info">
                            <div class="layui-form-item layui-row" id="yiwuyijian">
                                <table class="layui-table" id="addQualityDetailRecordTableList"
                                    lay-filter="addQualityDetailRecordTableList" style="margin: 1px 0 10px;"></table>
                            </div>
                            <div class="layui-form-item layui-row" id="jianyi">
                                <table class="layui-table" id="jianyiTableList" lay-filter="jianyiTableList"
                                    style="margin: 1px 0 10px;"></table>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <div class="layui-form-item text-right pd-20">
            <button class="layui-btn layui-btn-primary" type="button" ew-event="closeDialog">关闭</button>
        </div>
    </div>
</form>
<!--选择开工单-->
<script type="text/html" id="selectTheWorkProcessTemplate">
    <div class="layui-fluid">
        <div class="layui-card">
            <div class="layui-card-body">
                <!-- 头部操作栏 -->
                <div class="layui-form toolbar">
                    <div class="layui-form-item">
                        <div class="layui-inline">
                            <label class="layui-form-label w-auto">开工单编号：</label>
                            <div class="layui-input-inline mr0" style="width: 240px;">
                                <input name="code" class="layui-input" type="text" placeholder="开工单编号"/>
                            </div>
                        </div>
                        <div class="layui-inline">
                            <button class="layui-btn icon-btn" lay-filter="selectTheWorkProcessFormSubSearchLog"
                                    lay-submit style="padding: 0 24px;">
                                搜索
                            </button>
                            <button id="selectTheWorkProcessClose" class="layui-btn icon-btn">确认选择</button>
                        </div>
                    </div>
                </div>
                <!-- 表格 -->
                <table class="layui-table" id="selectTheWorkProcessTable"
                       lay-filter="selectTheWorkProcessTable"></table>
            </div>
        </div>
    </div>
</script>

<script type="text/html" id="viewAttachmentHtml">
    <div id="example1" style="height: 100%;"></div>
</script>

<!-- js部分 -->
<script>
    layui.use(['layer', 'form', 'table', 'laydate', 'admin', 'laytpl', 'upload', 'config'], async function () {
        var $ = layui.jquery;
        var layer = layui.layer;
        var config = layui.config;
        var upload = layui.upload;
        var table = layui.table;
        var admin = layui.admin;
        var form = layui.form;

        let addQualityInspectionTaskTableData = [];
        let addQualityDetailRecordList = [];
        let jianyiTableList = []
        let _type = "";
        const warehouseRes = await admin.reqPro(
            "enterprisecab/warehouse/admin/warehouse/list",
            { limit: 9999, status: 0 }
        );
        const warehouseList = warehouseRes.data;
        //选择开工单
        let templateData = admin.getTempData("workOrderQuaTaskInfoData");

        //修改or详情
        if (templateData) {
            document.getElementById("submissionQuantity").disabled = true;
            admin.initDataSelect('enterprise/device/admin/device/list', { limit: 9999 }, "inspectDeviceCode", templateData.inspectDeviceCode, "送检工站", "deviceName", "deviceCode");
            _type = templateData.type;
            $("#productionPlanId").val(templateData.workOrderCode);
        
            //初始化工单
            form.val('orderQualityTaskForm', templateData);
    
            //如果是详情
            $("#productionPlanId").disabled = true;//显示
            $("#qualityTestingCategoryId").disabled = true;//显示
            $("#submissionQuantity").disabled = true;//显示
            $("#inspectDeviceCode").disabled = true;//显示
            $("#inspectDeviceCode").disabled = true;//显示
            $("#carrierCode").disabled = true;//显示
            $("#remark").disabled = true;//显示
            //赢藏保存按钮
            $('button[lay-filter="addQualityTaskSubmit"]').hide();

            let imagUrl = templateData.accessory;

            if (imagUrl && imagUrl.indexOf(".pdf") !== -1) {
                PDFObject.embed(imagUrl, "#attachmentsDiv");

            } else {
                let attachmentHtml = "";
                imagUrl.split(",").forEach((attachmentUrl, index) => {
                    attachmentHtml += '<div><div><img style="max-width: 300px;max-height: 200px" src="' + attachmentUrl + '"></div></div>';
                });
                $('#attachmentsDiv').html(attachmentHtml);
            }
            //查询任务详情
            admin.req('production/quality/admin/workOrderQualityTask/getTaskDetailRecord', { taskId: templateData.id }, function (res) {
                if (res.code == 200) {
                    if (res.data) {
                        addQualityDetailRecordList = res.data.taskDetailInfoVos;
                        addQualityDetailRecordTable.reload({ data: addQualityDetailRecordList })
                    }
                    if (res.data.taskDetailInfoVos.length == 0 || res.data.taskDetailInfoVos[0].sampleCode.indexOf('SIMP') > -1) {
                        $("#yiwuyijian").hide();
                        $("#jianyi").show();
                        jianyiTableList = [
                            {
                                result: "合格",
                                simpleNum:res.data.taskDetailInfoVos[0].okQuantity,
                                warehouse:res.data.taskDetailInfoVos[0].okWarehouseType,
                            },
                            {
                                result: "返工",
                                simpleNum:res.data.taskDetailInfoVos[0].returnQuantity,
                                warehouse:res.data.taskDetailInfoVos[0].returnWarehouseType,
                            },
                            {
                                result: "报废",
                                simpleNum:res.data.taskDetailInfoVos[0].ngQuantity,
                                warehouse:res.data.taskDetailInfoVos[0].ngWarehouseType,
                            }
                        ]
                        table.reload("jianyiTableList", { data: jianyiTableList })
                    } else {
                        $("#jianyi").hide();
                        $("#yiwuyijian").show();
                    }
                    
                    //初始化时间节点
                    // <span id="createTaskTime">2013</span>
                    $("#createTaskTime").html(res.data.qualityTimeDetailInfoVo.createTime);
                    $("#getTaskTime").html(res.data.qualityTimeDetailInfoVo.getTime);
                    $("#checkTaskTime").html(res.data.qualityTimeDetailInfoVo.checkTime);

                    $("#createName").val(res.data.qualityTimeDetailInfoVo.createName);
                    $("#getName").val(res.data.qualityTimeDetailInfoVo.getName);
                    $("#checkName").val(res.data.qualityTimeDetailInfoVo.checkName);

                    $("#createPostName").val(res.data.qualityTimeDetailInfoVo.createPostName);
                    $("#getPostName").val(res.data.qualityTimeDetailInfoVo.getPostName);
                    $("#checkPostName").val(res.data.qualityTimeDetailInfoVo.checkPostName);

                    $("#getDepName").val(res.data.qualityTimeDetailInfoVo.getDepName);
                    $("#createDepName").val(res.data.qualityTimeDetailInfoVo.createDepName);
                    $("#checkDepName").val(res.data.qualityTimeDetailInfoVo.checkDepName);
                } else {
                    layer.msg(res.msg, { icon: 2 });
                }
            }, 'GET');
        }

        //初始化质检分类
        //quality_testing_category
        admin.initDataSelectAndMap('production/qualityTesting/admin/qualityTestingCategory/list', { limit: 9999 }, "qualityTestingCategoryId", templateData == null ? null : templateData.qualityTestingCategoryId, "质检分类", "name", "id", null);
        //初始化质检类型
        admin.initDataSelectAndMap('production/qualityTesting/admin/qualityTestingType/list', { limit: 9999 }, "qualityTestingTypeId", templateData == null ? null : templateData.qualityTestingTypeId, "送检类型", "name", "id", null);

        //质检性质
        admin.getDictList("qualityTestingNatureId", "sys_product_type_nature", templateData == null ? null : templateData.qualityTestingNatureId, "质检性质");
        //质检类型
        admin.getDictList("qcQualityTypeId", "sys_qc_quality_type", templateData == null ? null : templateData.qcQualityTypeId, "质检类型");


        //初始化表格
        let addQualityDetailRecordTable = table.render({
            elem: '#addQualityDetailRecordTableList',
            data: addQualityDetailRecordList,
            id: 'addQualityDetailRecordTableList',
            limit: 9999,
            cols: [[
                { field: 'sampleCode', edit: 'text', title: '样品编码', align: 'center' }
                , { field: 'statusDesc', title: '状态', align: 'center' }
                , { field: 'qualityTestingResultName', title: '检测结果', align: 'center' }
                , { field: 'modifierName', title: '检测人', align: 'center' }
                , { field: 'updateTime', title: '检测时间', align: 'center' }
                , { field: 'remark', title: '质检备注', edit: 'text', align: 'center' }
                , { align: 'center', toolbar: '#qualityItemTableBar', title: '操作' }
            ]]
        });
        table.render({
            elem: "#jianyiTableList",
            data: [...jianyiTableList],
            id: "jianyiTableList",
            limit: 9999,
            // data: [
            //     {
            //         result: "合格",
            //     },
            //     {
            //         result: "返工",
            //     },
            //     {
            //         result: "报废",
            //     },
            // ],
            cols: [
                [
                    { type: "numbers", title: "序号", align: "center" },
                    {
                        field: "result",
                        title: "质检结果",
                        align: "center",
                    },
                    {
                        field: "simpleNum",
                        title: "数量",
                        align: "center",
                    },
                    {
                        field: "warehouse",
                        title: "入库仓库类型",
                        align: "center",
                        templet: admin.setTableSelect(
                            "warehouse",
                            warehouseList.map((v) => {
                                v.label = v.name + "(" + v.warehouseTypeName + ")";
                                v.value = v.id;
                                return v;
                            }), true
                        ),
                    },
                ],
            ],
            done: () => {
                $("#jianyiTableList .layui-table-body").css("overflow", "visible");
                $("#jianyiTableList .layui-table-box").css("overflow", "visible");
                $("#jianyiTableList .layui-table-view").css("overflow", "visible");
            },
        });

        table.on('tool(addQualityDetailRecordTableList)', function (obj) {
            if (obj.event === 'detection') {
                let data = {};
                data.taskId = templateData.id;
                data.recordDetailId = obj.data.id;
                //判定结果
                data.qualityTestingResult = obj.data.qualityTestingResult;
                //检测备注
                data.JCRemark = obj.data.remark;
                //送检工位
                data.JCInspectDeviceCode = obj.data.inspectDeviceCode;
                data.paperSlipPic = obj.data.paperSlipPic;
                data.processId = templateData.processId;
                console.log('obj',obj);
                
                admin.putTempData("taskQualityDetailValueData", data)
                var detectionIndex = admin.formOpen({
                    type: 2,
                    area: ['80%', '92%'],
                    style: 'font-size: 20px;',
                    title: '录入/修改质检参数',
                    path: 'components/res/quality/taskQualityRecordDetailValueForm.html',
                    finish: function () {
                        table.reload(addQualityDetailRecordTable, {});
                    }
                });
            }
        });
    });
</script>